// 颜色变量
$primary-color: #409eff;
$success-color: #67c23a;
$warning-color: #e6a23c;
$danger-color: #f56c6c;
$info-color: #909399;

// 辅助颜色
$primary-light-9: #ecf5ff;
$primary-light-3: #79bbff;
$primary-dark-2: #337ecc;

// 文本颜色
$text-color-primary: #303133;
$text-color-regular: #606266;
$text-color-secondary: #909399;
$text-color-placeholder: #c0c4cc;

// 边框颜色
$border-color-base: #dcdfe6;
$border-color-light: #e4e7ed;
$border-color-lighter: #ebeef5;
$border-color-extra-light: #f2f6fc;

// 背景颜色
$background-color-base: #f5f7fa;
$background-color-light: #fafafa;

// 字体
$font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
$font-size-base: 14px;
$font-size-small: 12px;
$font-size-large: 16px;
$font-size-extra-large: 18px;

// 间距
$spacing-small: 8px;
$spacing-medium: 16px;
$spacing-large: 24px;
$spacing-extra-large: 32px;

// 阴影
$box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
$box-shadow-dark: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.12);
$box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1);

// 边框半径
$border-radius-base: 4px;
$border-radius-small: 2px;
$border-radius-large: 8px;

// 动画
$transition-duration: 0.3s;
$transition-function: ease;

// 断点
$mobile-breakpoint: 768px;
$tablet-breakpoint: 1024px;
$desktop-breakpoint: 1200px;

// 侧边栏
$sidebar-width: 240px;
$sidebar-collapsed-width: 64px;

// 头部
$header-height: 60px;

// Element Plus 主题定制
:root {
  --el-color-primary: #{$primary-color};
  --el-color-success: #{$success-color};
  --el-color-warning: #{$warning-color};
  --el-color-danger: #{$danger-color};
  --el-color-info: #{$info-color};
  
  --el-text-color-primary: #{$text-color-primary};
  --el-text-color-regular: #{$text-color-regular};
  --el-text-color-secondary: #{$text-color-secondary};
  --el-text-color-placeholder: #{$text-color-placeholder};
  
  --el-border-color: #{$border-color-base};
  --el-border-color-light: #{$border-color-light};
  --el-border-color-lighter: #{$border-color-lighter};
  --el-border-color-extra-light: #{$border-color-extra-light};
  
  --el-bg-color: #ffffff;
  --el-bg-color-page: #{$background-color-base};
  
  --el-font-family: #{$font-family};
  --el-font-size-base: #{$font-size-base};
  
  --el-border-radius-base: #{$border-radius-base};
  
  --el-transition-duration: #{$transition-duration};
  --el-transition-function-ease-in-out-bezier: #{$transition-function};
} 